import React, { createContext, useContext } from 'react';
import { ConfigProvider } from 'antd-mobile';
import zhCN from 'antd-mobile/es/locales/zh-CN';
import type { ConfigProviderProps } from 'antd-mobile/es/components/config-provider';

export interface MatConfigProviderProps extends ConfigProviderProps {
  prefixCls?: string;
}

export const MatContext: React.Context<{
  prefixCls: string;
}> = createContext({ prefixCls: 'mat' });

export function useConfigProvider() {
  return useContext(MatContext);
}

const MatConfigProvider: React.FC<MatConfigProviderProps> = ({
  locale,
  children,
  prefixCls = 'mat',
  ...props
}) => {
  return (
    <ConfigProvider locale={zhCN} {...props}>
      <MatContext.Provider value={{ prefixCls }}>{children}</MatContext.Provider>
    </ConfigProvider>
  );
};

export default MatConfigProvider;
